import { Tabs } from 'antd'
import { useAppStore } from '@renderer/pages/designer/store/appStore'
import './index.less';
// 底部栏
export default function BottomSideBar() {
  const bottomActiveKey = useAppStore(state => state.bottomActiveKey)
  const { updateBottomTabActiveKey } = useAppStore(state => state.actions)

  return <Tabs
    className='bottom-side-bar-tabs'
    activeKey={bottomActiveKey}
    tabPosition='top'
    onChange={updateBottomTabActiveKey}
    size='small'
    items={
      [
        {
          label: '日志',
          key: 'logs',
          children: ''
        },
        {
          label: '元素库',
          key: 'elements',
          children: ''
        },
        {
          label: '图像库',
          key: 'images',
          children: ''
        },
        {
          label: '运行变量',
          key: 'vars',
          children: ''
        }
      ]
    }
  />
}
